<template>
  <div class="companyIntroduction">
    <div class="title">关于我们</div>
    <div class="content">
      <div class="leftbox">
        <div class="firstbox">
          <img src="/image/aboutus/enterpriseHonor.png" alt="" />
          <div class="tittle">招商平台</div>
          <div class="hr"></div>
          <div class="subtitle needmargin">Platform</div>
        </div>
        <div class="secondbox">
          <img src="/image/aboutus/companyBrochure.png" alt="" />
          <div class="tittle">公司简介</div>
          <div class="hr"></div>
          <div class="subtitle needmargin">COMPANY</div>
          <div class="subtitle">INTRODUTION</div>
        </div>
        <div class="thirdlybox">
          <img src="/image/aboutus/customizedService.png" alt="" />
          <div class="tittle">定制服务</div>
          <div class="hr"></div>
          <div class="subtitle needmargin">Customized</div>
          <div class="subtitle">service</div>
        </div>
      </div>
      <div class="rightbox">
        <p>
          为了给企业提供更专业的招商服务，成为中小企业的助推器；同时，为了降低企业招商运营的成本，提高市场运营的效率，降低企业对招商人员能力的依赖，结合生意港在招商领域的专业能力，生意港平台孕育而生。
        </p>
        <p>
          生意港具有丰富的招商实战经验，长期立足于招商领域，专注招商模式的创新，引领招商行业新的变革，公司按照招商思维独家研发出标准招商工具体系、在线招商流程及经验输出，引领5G招商新时代。
        </p>
        <p>
          生意港平台主要提供项目招商APP、项目招商小程序、数据管控系统、在线招商全流程输出等软件技术开发与销售服务。
        </p>
      </div>
    </div>
    <div class="functionIntroduction">
      <div class="item item1">
        <img src="/image/aboutus/talk.png" alt="" />
        <div class="tittle">数据管控定制服务</div>
        <div class="content">
          <p class="conT">企业服务客户</p>
          <div class="conC">
            <p>纽交所、新三板上市公司</p>
          </div>
        </div>
      </div>
      <div class="item item2">
        <img src="/image/aboutus/talk.png" alt="" />
        <div class="tittle">APP软件定制研发</div>
        <div class="content">
          <p class="conT">APP及软件技术开发与销售</p>
          <div class="conC">
            <p>针对客户的项目情况，定制符合客户</p>
            <p>公司及项目实际情况的招商APP</p>
          </div>
        </div>
      </div>
      <div class="item item3">
        <img src="/image/aboutus/talk.png" alt="" />
        <div class="tittle">在线招商全流程输出</div>
        <div class="content">
          <p class="conT">定制培训内容</p>
          <div class="conC">
            <p>重塑招商流程</p>
            <p>改变传统的线下招商流程体系</p>
          </div>
        </div>
      </div>
       <div class="item item4">
        <img src="/image/aboutus/talk.png" alt="" />
        <div class="tittle">项目招商小程序</div>
        <div class="content">
          <p class="conT">形式上创新，与时俱进</p>
          <div class="conC">
            <p>内容视频化，更生动</p>
            <p>获取在线流量成本低</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name:"linkUs-companyIntroduction"
}
</script>
<style lang="scss" scoped>
.companyIntroduction {
  .title {
    margin-top: 56px;
    text-align: center;
    background: url("/image/aboutus/aboutUs.png") no-repeat;
    background-position: top center;
    font-size: 35px;
    line-height: 80px;
    letter-spacing: 4px;
    color: #4a7cee;
  }
  .content {
    display: flex;
    .leftbox {
      margin: 0 30px 0 26px;
      padding-bottom: 147px;
      display: flex;
      background: url("/image/aboutus/contentBg.png") no-repeat left top;
      align-items: center;
      .firstbox,
      .thirdlybox {
        width: 156px;
        height: 209px;
        border-radius: 6px;
        .needmargin {
          margin-top: 14px;
        }
      }
      .firstbox,
      .thirdlybox,
      .secondbox {
        display: flex;
        flex-direction: column;
        align-items: center;
        .tittle {
          font-size: 19px;
          font-family: SourceHanSansCN;
          font-weight: bold;
          color: rgba(255, 255, 255, 1);
          line-height: 8px;
          margin-top: 24px;
        }
        .hr {
          width: 25px;
          margin-top: 24px;
          height: 2px;
          background: rgba(255, 255, 255, 1);
        }
        .subtitle {
          font-size: 14px;
          font-family: SourceHanSansCN;
          font-weight: 400;
          color: rgba(255, 255, 255, 1);
          line-height: 20px;
        }
      }
      .firstbox {
        background: rgba(255, 113, 149, 1);
        background: url("/image/aboutus/pink.png") no-repeat 100% 100%;
        img {
          width: 40px;
          height: 46px;
          opacity: 0.6;
          margin-top: 23px;
        }
      }
      .secondbox {
        margin: 0 12px;
        width: 155px;
        height: 316px;
        border-radius: 6px;
        background: url("/image/aboutus/companyBrochureBg.png") no-repeat
          100% 100%;
        img {
          width: 68px;
          height: 64px;
          margin-top: 60px;
          opacity: 0.9;
        }
        .needmargin {
          margin-top: 18px;
        }
      }
      .thirdlybox {
        background: rgba(48, 193, 205, 1);
        background: url("/image/aboutus/green.png") no-repeat 100% 100%;
        img {
          width: 35px;
          height: 39px;
          opacity: 0.6;
          margin-top: 30px;
        }
      }
    }
    .rightbox {
      font-size: 16px;
      letter-spacing: 0px;
      color: #333333;
      p {
        text-indent: 2em;
        line-height: 28px;
        margin-top: 12px;
      }
    }
  }
  .functionIntroduction {
    width: 1033px;
    margin: 0 auto;
    display: flex;
    background: url("http://syg-photo.oss-cn-shanghai.aliyuncs.com/yingdin/photo/functionIntroductionbg.png-1593654584000");
    padding: 64px 0;
    margin-bottom: 120px;
    .item {
      display: flex;
      flex: 1;
      flex-direction: column;
      align-items: center;
      img {
        margin-top: 25px;
        width: 45px;
        height: 37px;
      }
      .tittle {
        font-size: 20PX;
        letter-spacing: 1px;
        color: #ffffff;
        margin-top: 13px;
      }
      .content {
        display: flex;
        flex-direction: column;
        align-items: center;
        opacity: 0.8;
        .conT {
          margin-top: 32px;
          font-size: 14px;
          letter-spacing: 1px;
          color: #ffffff;
          font-weight: 300;
        }
        .conC {
          text-align: center;
          margin-top: 8px;
          font-size: 14px;
          font-weight: 300;
          color: rgba(255, 255, 255, 1);
          line-height: 38px;
        }
      }
    }
    .item:nth-of-type(2) {
      border-left: 1px solid rgba(246, 246, 246, 1);
      border-right: 1px solid rgba(246, 246, 246, 1);
    }
    .item:nth-of-type(3) {
      border-right: 1px solid rgba(246, 246, 246, 1);
    }
    .item1 {
      width: 308px;
    }
    .item2 {
      width: 398px;
    }
    .item3 {
      width: 323px;
    }
  }
}
</style>
